<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h2>测试删除</h2>
<input type="text">
<input type="button" value="添加">
<ul>
    <li>北京</li>
    <li>上海</li>
    <li>广东</li>
</ul>
<button>隐藏</button>
<button>显示</button>
<button>切换</button>
<hr>
<img src="12.webp" alt="">
<!--引入框架-->
<script src="jq.js"></script>
<script>

   //  // 创建元素对象
   //  let d=$("<div>这是div</div>");
   //  // 添加到body标签里面
   //  $("body").append(d);
   // 删除h2
   //  $("h2").remove();


   //给按钮添加事件
   $("input:last").click(function () {
   //    创建li
       let li= $("<li></li>");
       // 把文本框的值给到li
       li.text($("input:first").val());
       //把li添加到ul里面
       $("ul").append(li);

   })

    $("button:eq(0)").click(function () {
        $("img").hide(); //隐藏
    })
    $("button:eq(1)").click(function () {
        $("img").show(); //显示
    })
    $("button:eq(2)").click(function () {
        $("img").toggle(); //切换
    })


</script>
</body>
</html>